<template>
	<view class="login-page">
		<view class="login-wrap">
			<view class="log">
				<image src="../../static/allimg/hosp.jpg" mode=""></image>
				<h2 style="color: rgb(0,139, 250);">欢迎注册</h2>
			</view>
			<van-form @submit="onSubmit">
				<van-cell-group inset>
					<van-field v-model="username" name="username" label="用户名" placeholder="用户名"
						:rules="[{ required: true, message: '请填写用户名' }]" />
						<van-field v-model="phone" name="phone" label="手机号码" placeholder="手机号码"
							:rules="[{ required: true, message: '请填写手机号码' }]" />
					<van-field v-model="password" type="password" name="password" label="密码" placeholder="密码"
						:rules="[{ required: true, message: '请填写密码' }]" />
				<van-field v-model="password" type="password" name="password" label="密码" placeholder="确认密码"
						:rules="[{ required: true, message: '请填写密码' }]" />
				</van-cell-group>
				<div style="margin: 16px;">
					<van-button round block type="primary" native-type="submit" size="normal">
						确定
					</van-button>
				</div>
			</van-form>
			<p @click="gologin">已注册?前往登录</p>
		</view>
		
	</view>
</template>

<script setup>
	import { showToast } from 'vant';
import {ref} from 'vue';
	import api from '../../lib/request';
	const username = ref('');
	const password = ref('');
	const phone = ref('')
	// 确定
	const onSubmit =async (values) => {
			let res = await api.post('/user/user',values)
			let {code,msg} = res
			if(!code){ return showToast(msg) }
			setTimeout(()=>{
				uni.redirectTo({ url:'/views/login/login' })	
			},1500)
	};
	// 去登录页面
	const gologin=()=>{
		uni.reLaunch({
			url:'/views/login/login'
		})
	}
</script>

<style>
.login-wrap{
	position: absolute;
	top: 3.5rem;
	left: calc(100vw - 350px);
}
.log{
	width: 370rpx;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	margin: auto;

}
image{
	width: 180rpx;
	height: 180rpx;
	border-radius: 50%;
	margin-bottom: 40rpx;
}
.log>h2{
	margin-bottom: 40rpx;
}
p{
	position: absolute;
	right: 40rpx;
	color: #8a8a8a;
}
</style>